import React from 'react'
import { Redirect, Switch, Route } from 'react-router-dom'
import { Layout } from 'antd'

import storage from '../../utils/storageUtil'
import './admin.css'
import LeftNav from '../../components/leftNav'
import MyHeader from '../../components/header'
import Home from '../home/home'
import Category from '../category/category'
import Product from '../product/product'
import User from '../user/user'
import Role from '../role/role'
import Column from '../maps/column'
import Line from '../maps/line'
import Circle from '../maps/circle'

const { Header, Footer, Sider, Content } = Layout

export default class Admin extends React.Component {
    render() {
        if (!storage.getUserStorage().username) {
            return (
                <Redirect to='/login' />
            )
        }
        return (
            <Layout className='main-frame'>
                <Sider className='left-nav'>
                    <LeftNav />
                </Sider>
                <Layout>
                    <Header className='header'>
                        <MyHeader />
                    </Header>
                    <Content className='content-frame'>
                        <Switch>
                            <Route from='/home' component={ Home }/>
                            <Route from='/category' component={ Category }/>
                            <Route from='/product' component={ Product }/>
                            <Route from='/user' component={ User }/>
                            <Route from='/role' component={ Role }/>
                            <Route from='/column' component={ Column }/>
                            <Route from='/line' component={ Line }/>
                            <Route from='/circle' component={ Circle }/>
                            <Redirect to='/home'/>
                        </Switch>
                    </Content>
                    <Footer className='footer'>使用chrome浏览器访问效果更佳</Footer>
                </Layout>
            </Layout>
        )
    }
}